<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="../libs/css/bootstrap.min.css">
    <link rel="stylesheet" href="../css/buy.css">
    <link rel="stylesheet" href="../libs/css/select.css">
    <script src="../libs/js/jquery.min.js"></script>
    <script src="../libs/js/pxmu.min.js"></script>
    <script src="../js/buy.js"></script>
    <script src="../libs/js/city_code.js"></script>
    <script src="../libs/js/select.js"></script>
</head>
<body>
    <div id="header" class="header">

    </div>
    <div id="content">
        <div class="container">
            <h2>待支付</h2>
            <h3>共3000元</h3>
            <div class="tit">支付方式</div>
            <div id="zhifu" class="d-flex justify-content-around" >
                
                <label for="">支付宝<input type="radio" name="ral" id="zhifubao" value="支付宝"></label>
                <label for="">微信支付<input type="radio" name="ral" id="weixin" value="微信"></label> 
                <label for="">银联网银<input type="radio" name="ral" id="yinlian" value="银联"></label>     
            </div>

            <button class="btn">支付</button>
            <div class="z-erweima">
                <img class="zhi" src="../imgs/z.jpg" alt="">
                <img class="wei" src="../imgs/wx.jpg" alt="">
                <img class="yin" src="../imgs/y.jpg" alt="">
            </div>
        </div>
    </div>
<script>
    var $zhi=$(".zhi")
    var $wei=$(".wei")
    var $yin=$(".yin")
    var $i= $("input")
    var $btn=$(".btn")
    console.log($i[0].checked)
    $btn.click(function(){
        console.log(2)
        if($i[0].checked){
            console.log("支付宝")
            $zhi.css("display","block")
            $wei.css("display","none")
            $yin.css("display","none")
        }
          else if($i[1].checked){
            console.log("微信")
            $wei.css("display","block")
            $zhi.css("display","none")
            $yin.css("display","none")
        }
        else if($i[2].checked){
            console.log("银联")
            $wei.css("display","none")
            $zhi.css("display","none")
            $yin.css("display","block")
        }
    })
   


</script>
</body>
</html>